<template>
  <div>
    <div class="lable_page_software">
      <lable-page :itemList=lablePageData @changeLable="lableChange"></lable-page>
      <div class="item-content" v-html="lablePageData[current] && lablePageData[current].content">

      </div>
    </div>
    <train-data :mRight=71 :dataList=dataList></train-data>
  </div>
  
</template>

<script>
import lablePage from '../publicComponent/lablePage'
import trainData from './trainData'
import {collegeSoftwareLable, collegeDataList} from '@/api/getData'
export default {
  name: 'lable_page_software',
  data () {
      return{
        selfList: [
            '阶段一',
            '阶段二',
            '阶段三',
            '阶段四',
            '阶段五',
            '阶段六',
            '阶段七'
        ],
        current: '0',
        lablePageData: [],
        dataList: []
      }
    
  },
  components: {
    lablePage,
    trainData
  },
  mounted(){
    collegeSoftwareLable.call(this).then(res=>{
      this.lablePageData = res;
    })
    collegeDataList.call(this).then(res=>{
      this.dataList = res;
    })
  },
  methods: {
      lableChange(key){
          this.current = key
      }
  }
}
</script>

<style lang="stylus" scoped>
.lable_page_software{
  background:rgba(255,255,255,1);
  box-shadow:0px 1px 2px 0px rgba(0,0,0,0.1);
  margin-bottom: 20px;
  border-bottom: 1px solid transparent;  
}
.item-content{
  padding: 40px 19px;
}
</style>
